

import 'package:music_player/enums/music_mode.dart';
import 'package:music_player/model/musci_model.dart';
import 'package:music_player/utils/time_util.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:provider/provider.dart';

import '../model/theme_model.dart';

class MusicBar extends StatelessWidget {
  const MusicBar({super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
        height: 60,
        child:const Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Expanded(flex:1,child: Text("ok")),
            Expanded(flex:1,child: MusicController()),
            Expanded(flex:1,child: RightWidget())
          ],
        )
    );
  }
}

class LeftWidget extends StatefulWidget {
  const LeftWidget({super.key});

  @override
  State<LeftWidget> createState() => _LeftWidgetState();
}

class _LeftWidgetState extends State<LeftWidget> {
  @override
  Widget build(BuildContext context) {
    return ElevatedButton(onPressed: (){
      final musicModel = context.read<MusicModel>();
      musicModel.changeMusic(context);
    }, child: Text("ok"));
  }
}


class MusicController extends StatefulWidget {
  const MusicController({super.key});

  @override
  State<MusicController> createState() => _MusicControllerState();
}

class _MusicControllerState extends State<MusicController> {

  void _previous(BuildContext context) {
    final musicModel = context.read<MusicModel>();
    print(musicModel.previousMusic(context).playUrl);

    /*final themeModel = context.read<ThemeModel>();
    themeModel.bgColor = Colors.purple;*/
  }

  void _play(BuildContext context) {
    final musicModel = context.read<MusicModel>();
    musicModel.playMusic(context);

   /* final themeModel = context.read<ThemeModel>();
    themeModel.themeColor = musicModel.play?Colors.black:Colors.white;*/

  }



  void _next(BuildContext context) {
    final musicModel = context.read<MusicModel>();
    print(musicModel.nextMusic(context).playUrl);

    /*final themeModel = context.read<ThemeModel>();
    themeModel.bgColor = Colors.blue;*/
  }

  @override
  Widget build(BuildContext context) {
    final color = context.watch<ThemeModel>().themeColor;
    final musicModel = context.watch<MusicModel>();
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        InkWell(
          onTap: ()=>_previous(context),
          child: Icon(
            Icons.skip_previous,
            color: color,
          ),
        ),
        const SizedBox(
          width: 10,
        ),
        InkWell(
          onTap: ()=>_play(context),
          child: musicModel.play
              ? Icon(
                  Icons.pause,
                  color: color,
                )
              : Icon(
                  Icons.play_arrow_outlined,
                  color: color,
                ),
        ),
        const SizedBox(
          width: 10,
        ),
        InkWell(
          onTap: ()=>_next(context),
          child: Icon(
            Icons.skip_next,
            color: color,
          ),
        ),
      ],
    );
  }
}

class MusicAudio extends StatefulWidget {
  const MusicAudio({super.key});

  @override
  State<MusicAudio> createState() => _MusicAudioState();
}

class _MusicAudioState extends State<MusicAudio> {
  double _sliderValue = 0;

  @override
  Widget build(BuildContext context) {
    return Container(
      width: 200,
      child: Row(
        children: [
          Icon(Icons.music_note),
          Expanded(
            child: Slider(
              value: _sliderValue,
              min: 0,
              max: 100,
              divisions: 100,
              activeColor: Colors.purple, // 设置活动颜色
              inactiveColor: Colors.blue, // 设置非活动颜色
              label: _sliderValue.round().toString(),
              onChanged: (double value) {
                setState(() {
                  _sliderValue = value;
                });
              },
            )
          )
        ],
      ),
    );
  }
}

class RightWidget extends StatelessWidget {
  const RightWidget({super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
      //color: Colors.yellow,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: [
          PlayProgress(),
          ModeWidget(),
          AudioWidget()
        ],
      ),
    );
  }
}

class ModeWidget extends StatefulWidget {
  const ModeWidget({super.key});

  @override
  State<ModeWidget> createState() => _ModeWidgetState();
}

class _ModeWidgetState extends State<ModeWidget> {

  void _mode(MusicModel musicModel){
    musicModel.musicMode = musicModel.musicMode.getNextMode();
  }

  IconData _icon(MusicModel musicModel){
    final musicMode = musicModel.musicMode;
    switch(musicMode){
      case MusicMode.singleLoop:
        return Icons.loop;
      case MusicMode.randomPlay:
       return Icons.shuffle;
      case MusicMode.sequentialPlay:
        return Icons.list;
      default:
        return Icons.list;
    }
  }

  @override
  Widget build(BuildContext context) {
    final themeModel = context.watch<ThemeModel>();
    final musicModel = context.watch<MusicModel>();
    return GestureDetector(
        onTap: () => _mode(musicModel),
        child: Icon(_icon(musicModel), color: themeModel.themeColor));
  }
}

class PlayProgress extends StatefulWidget {
  const PlayProgress({super.key});

  @override
  State<PlayProgress> createState() => _PlayProgressState();
}

class _PlayProgressState extends State<PlayProgress> {
  @override
  Widget build(BuildContext context) {
    final musicModel = context.watch<MusicModel>();
    final themeModel = context.watch<ThemeModel>();

    final style = TextStyle(
      fontSize: 14,
      color: themeModel.themeColor
    );
    return Row(
      children: [
        Text(TimeUtil.toLocalTime(musicModel.playLength),style: style,),
        const SizedBox(width: 4,),
        Text("/",style: style,),
        const SizedBox(width: 4,),
        Text(TimeUtil.toLocalTime(musicModel.musicLength),style: style,)
      ],
    );
  }
}


class AudioWidget extends StatefulWidget {
  const AudioWidget({super.key});

  @override
  State<AudioWidget> createState() => _AudioWidgetState();
}

class _AudioWidgetState extends State<AudioWidget> {
  @override
  Widget build(BuildContext context) {
    final musicModel = context.watch<MusicModel>();
    final themeModel = context.watch<ThemeModel>();
    return Row(
      children: [
        Icon(Icons.volume_up_outlined,color: themeModel.themeColor,size: 16,),
        const SizedBox(width: 5,),
        SizedBox(
          width: 60,
          child: SliderTheme(
              data: SliderTheme.of(context).copyWith(
                trackHeight: 3.0, // 可以设置滑块的高度
                overlayShape: SliderComponentShape.noOverlay, // 移除滑块的点击扩展范围
                thumbShape: RoundSliderThumbShape(enabledThumbRadius:0.0 ), // 自定义滑块的thumb形状
              ),
              child: Slider(
                min: 0.0,
                max: 1.0,
                value: musicModel.volume,
                onChanged: (double value) {
                  musicModel.volume = value;
                },
              )),
        ),
      ],
    );
  }
}


